<html>
<head>
    <meta name="viewport" content="width=device-width,initial-scale=1"/>
    <meta charset="utf-8"/>
    <title>米塔企业微云</title>
    <link href="../plugins/bootstrap/bootstrap.min.css" rel="stylesheet">
    <link href="../plugins/bootstrapValidator/bootstrapValidator.min.css" rel="stylesheet">
    <link href="../customize/css/iconfont.css" rel="stylesheet">
    <link href="../customize/css/content.css" rel="stylesheet">
</head>
<body>
<div class="d-flex justify-content-between my-3">
    <div>
        <a class="explain-btn" href="##" onclick="parent.toSubPage('alarmDay.html')">单日视图</a><a class="explain-btn active ml-3" href="##">历史视图</a>
    </div>
    <div>
        <div class="input-group">
            <input class="form-control" id="searchTimeHistory" type="text" autocomplete="off" placeholder="选择时间范围" style="width:224px;">
            <div class="input-group-append">
                <button class="btn btn-primary" type="button" onclick="loadHistoryData()"><i
                        class="iconfont icon-dituyechaxun"></i></button>
            </div>
        </div>
    </div>
</div>
<div class="d-flex">
    <div class="flex-1 border-section">
        <div class="section-title">告警统计
            <span class="title-icon"></span>
        </div>
        <div class="chart my-3" id="chart_line1" style="height: 363px"></div>
    </div>
    <div class="flex-1 border-section ml-3">
        <div class="section-title">告警处理信息
            <span class="title-icon"></span>
        </div>
        <div class="chart my-3" id="chart_bar1" style="height: 363px"></div>
    </div>
</div>
<div class="d-flex mt-3">
    <div class="flex-1 border-section">
        <div class="section-title">告警原因分布
            <span class="title-icon"></span>
        </div>
        <div class="chart" id="chart_pie1" style="height: 395px"></div>
    </div>
    <div class="flex-1 border-section ml-3">
        <div class="section-title">告警设备类型
            <span class="title-icon"></span>
        </div>
        <div class="chart" id="chart_pie2" style="height: 395px"></div>
    </div>
</div>
<script src="../plugins/jquery-3.4.1.min.js"></script>
<script src="../plugins/bootstrap/bootstrap.bundle.min.js"></script>
<script src="../plugins/alert.js"></script>
<script src="../plugins/echarts.min.js"></script>
<script src="../plugins/laydate/laydate.js"></script>
<script src="../plugins/jquery.cookie.js"></script>
<script src="../customize/js/common.js"></script>
<script src="../customize/js/CommonUtils.js"></script>
<script src="../customize/js/customModalV2.js"></script>
<script src="../customize/js/alarmHistory.js"></script>
</body>
</html>